import 'package:chat_app_project/dao/user_dao.dart';
import 'package:chat_app_project/models/const.dart';
import 'package:chat_app_project/models/user_login_info_entity.dart';
import 'package:chat_app_project/screens/login/login.dart';
import 'package:chat_app_project/screens/person/follow/fans.dart';
import 'package:chat_app_project/screens/person/follow/followers.dart';
import 'package:chat_app_project/screens/person/settings/protocol.dart';
import 'package:chat_app_project/screens/person/settings/settings.dart';
import 'package:chat_app_project/screens/person/wallet.dart';
import 'package:flutter/material.dart';

import '../../config/const.dart';
import '../../tool/event_bus.dart';
import '../../tool/im.dart';

class ProfilePage extends StatefulWidget {
  const ProfilePage({Key? key}) : super(key: key);

  @override
  State<ProfilePage> createState() => _ProfilePageState();
}

class _ProfilePageState extends State<ProfilePage> {
  late UserLoginInfoEntity _user = UserLoginInfoEntity();
  bool _isLogin = false;

  @override
  void initState() {
    super.initState();
    bus.on(TP_PROFILE_UPDATE, (arg) {
      updateInfo();
    });
    bus.emit(TP_PROFILE_UPDATE);
  }

  @override
  void dispose() {
    super.dispose();
    bus.off(TP_PROFILE_UPDATE);
  }

  void updateInfo() {
    UserDao.info({}).then((value) {
      UserLoginInfoEntity userLoginInfoEntity =
          UserLoginInfoEntity.fromJson(value.data);
      _user = userLoginInfoEntity;
      _isLogin = UserInfo.isLogin(predicate: () {});
      setState(() {});
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: const BoxDecoration(
          gradient: LinearGradient(
        colors: [Color(0xFFBBDEFB), Colors.white70], //背景渐变色：顶部蓝色到底部灰色
        begin: Alignment.topCenter, //颜色渐变从顶部居中开始
        end: Alignment.bottomCenter, //颜色渐变从底部居中结束
      )), //背景装饰：颜色渐变
      child: Column(
        children: [
          if (_isLogin) topInfo(context), //头像+昵称+编辑资料
          userDate(), //用户数据：关注+收藏+点赞+历史
          commonFunction(), //常用功能
        ],
      ),
    );
  }

  /*顶部信息：头像+昵称+编辑资料*/
  Padding topInfo(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.fromLTRB(50, 90, 10, 40),
      child: Stack(
        children: [
          Row(children: [
            GestureDetector(
              child: ClipOval(
                child: Image.network(_user.avatar ?? "",
                    width: 50, height: 50, fit: BoxFit.cover),
              ),
              onTap: () {},
            ),
            Padding(
                padding: const EdgeInsets.fromLTRB(16, 0, 10, 0),
                child: Text(_user.nickName ?? "",
                    style: const TextStyle(
                        fontWeight: FontWeight.w600, fontSize: 16))),
          ]),
          Positioned(
              right: 10,
              child: TextButton.icon(
                style: ButtonStyle(
                  backgroundColor: MaterialStateProperty.all(Colors.white70),
                  //背景色
                  shape: MaterialStateProperty.all(RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(10))), //圆角
                ),
                onPressed: () {
                  Navigator.push(context,
                      MaterialPageRoute(builder: (context) => const Wallet()));
                },
                icon: const Icon(Icons.wallet_rounded),
                label: const Text('我的钱包',
                    style: TextStyle(color: Colors.blueAccent)),
              ))
        ],
      ),
    );
  }

  /*用户数据：关注+收藏+历史*/
  Container userDate() {
    return Container(
        margin: const EdgeInsets.all(8),
        height: 80,
        width: 360,
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly, //主轴方向（横向）间距
          children: [
            Column(
              children: [
                Text('${_user.contents}',
                    style:
                        TextStyle(fontWeight: FontWeight.w600, fontSize: 16)),
                SizedBox(
                  height: 6,
                ),
                GestureDetector(
                  onTap: () {},
                  child: const Text('内容'),
                )
              ],
            ),
            GestureDetector(
              onTap: () {
                Navigator.push(context,
                    MaterialPageRoute(builder: (context) => const Followers()));
              },
              child: Column(
                children: [
                  Text("${_user.follows}",
                      style: const TextStyle(
                          fontWeight: FontWeight.w600, fontSize: 16)),
                  const SizedBox(
                    height: 6,
                  ),
                  const Text('关注')
                ],
              ),
            ),
            GestureDetector(
              onTap: () {
                Navigator.push(context,
                    MaterialPageRoute(builder: (context) => const Fans()));
              },
              child: Column(
                children: [
                  Text('${_user.fans}',
                      style:
                          TextStyle(fontWeight: FontWeight.w600, fontSize: 16)),
                  const SizedBox(
                    height: 6,
                  ),
                  const Text('粉丝')
                ],
              ),
            ),
            Column(
              children: [
                Text('${_user.collects}',
                    style:
                        TextStyle(fontWeight: FontWeight.w600, fontSize: 16)),
                const SizedBox(
                  height: 6,
                ),
                Text('收藏'),
              ],
            ),
            Column(
              children: [
                Text('${_user.likes}',
                    style: const TextStyle(
                        fontWeight: FontWeight.w600, fontSize: 16)),
                const SizedBox(
                  height: 6,
                ),
                const Text('喜欢'),
              ],
            ),
          ],
        ));
  }

  /*常用功能*/
  Container commonFunction() {
    return Container(
        margin: const EdgeInsets.all(5),
        height: 120,
        width: 360,
        decoration: BoxDecoration(
          color: const Color.fromARGB(200, 248, 248, 255), // 白色
          borderRadius: BorderRadius.circular(12), // 设置圆角
        ),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly, //垂直方向平分
          children: [
            const Padding(
              padding: EdgeInsets.only(left: 10),
              child: Align(
                alignment: Alignment.topLeft,
                child: Text('我的服务',
                    style:
                        TextStyle(fontWeight: FontWeight.w600, fontSize: 14)),
              ),
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly, //主轴方向（横向）间距
              children: [
                Column(
                  children: [
                    IconButton(
                      icon: const Icon(Icons.announcement_sharp),
                      onPressed: () {
                        Navigator.push(context,
                            MaterialPageRoute(builder: (context) => const Protocol()));
                      },
                      color: Colors.blue,
                    ),
                    const Text('协议'),
                  ],
                ),
                Column(
                  children: [
                    IconButton(
                      icon: const Icon(Icons.add_chart_sharp),
                      onPressed: () {},
                      color: Colors.grey,
                    ),
                    const Text('黑名单'),
                  ],
                ),
                Column(
                  children: [
                    IconButton(
                      icon: const Icon(Icons.settings),
                      onPressed: () {
                        Navigator.push(context,
                            MaterialPageRoute(builder: (context) => const Settings()));
                        },
                      color: Colors.green,
                    ),
                    const Text('设置'),
                  ],
                ),
                // if (_isLogin)
                Column(
                  children: [
                    IconButton(
                      icon: const Icon(Icons.output),
                      onPressed: () {
                        //断开IM连接
                        IMUtils.disconnect();
                        //退出
                        UserInfo.logout();
                        Navigator.push(
                            context,
                            MaterialPageRoute(
                                builder: (context) => const LoginPage()));
                      },
                      color: Colors.deepOrangeAccent,
                    ),
                    const Text('退出'),
                  ],
                )
              ],
            )
          ],
        ));
  }
}
